<style lang="less" scoped>
</style>
<template>
  <Card class="site-info-container">
    <Form ref="myForm" :rules="ruleValidate" :model="formItem" :label-width="140">
      <FormItem label="accesskey" prop="accesskey">
        <Input v-model="formItem.accesskey" style="width:260px"
        ></Input>
      </FormItem>
      <FormItem label="secretkey" prop="secretkey">
        <Input v-model="formItem.secretkey" style="width:260px"
        ></Input>
      </FormItem>
      <FormItem label="bucket" prop="bucket">
        <Input v-model="formItem.bucket" style="width:260px"
        ></Input>
      </FormItem>
      <FormItem label="host" prop="host">
        <Input v-model="formItem.host" style="width:260px"
        ></Input>
      </FormItem>
      <FormItem label="endpoint" prop="endpoint">
        <Input v-model="formItem.endpoint" style="width:260px"
        ></Input>
      </FormItem>
    </Form>
    <div class="site-info-btn-wrap">
      <Button type="primary" @click="submit" :loading="loading">保存</Button>
    </div>
  </Card>


</template>
<script>
  import {checkDomain,checkUrl} from '@/libs/util'
  import {get, save} from '@/api/oss'

  export default {
    name: 'site-info',
    data() {
      return {
        headers: null,
        admin: false,
        edit: false,
        loading: false,
        formItem: {
          accesskey: '',
          secretkey: '',
          bucket: '',
          host: '',
          endpoint: '',
        },
        ruleValidate: {
          accesskey: [
            {required: true, message: '请输入', trigger: 'blur'}
          ],
          secretkey: [
            {required: true, message: '请输入', trigger: 'blur'}
          ],
          bucket: [
            {required: true, message: '请输入', trigger: 'blur'}
          ],
          host: [
            {required: true, message: 'url不正确', trigger: 'blur'}
          ],
          endpoint: [
            {required: true, message: '不正确', trigger: 'blur'},
            {
              validator: (rule, value, callback) => {
                if (!checkDomain(value)) {
                  callback('不正确');
                } else {
                  callback();
                }
              }
            }
          ]
        }
      };
    },
    created() {
      this.init();
    },
    methods: {
      init() {
        this.getData();
      },
      getData() {
        get().then(rep => {
          if(rep.data.data!=null){
            this.formItem = rep.data.data;
          }
        })
      },
      save() {
        let vm = this;
        save(this.formItem).then(rep => {
          vm.$Message.success('保存成功');
          vm.loading = false
        })
      },
      submit() {
        let vm = this;
        this.$refs['myForm'].validate((valid) => {
          if (valid) {
            vm.loading = true
            vm.save();
          }
        })
      },
    }
  }
</script>
